<template>
	<view class="tabs">
		<u-tabs :list="tabsList" @click="tabsClick" :current="tabIndex" lineColor="#FF8600" :activeStyle="{
					color: '#333333',
					fontWeight: 'bold',
					fontSize: '30rpx'
				}" :inactiveStyle="{
					color: '#999999',
					fontWeight: '500',
					fontSize: '28rpx'
				}"></u-tabs>
		<view class="line u-border-bottom"></view>
	</view>
</template>

<script>
	export default {
		props: {
			tabsList: {
				type: Array,
				default: () => []
			},
			tabIndex: {
				type: Number,
				default: 0
			}
		},
		methods: {
			tabsClick(e) {
				this.$emit('update:tabIndex', e.index)
				this.$emit('change', e.index)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.tabs {}
</style>